<template>
  <!-- 用户信息详情 -->
  <div class="userInfo">
    <h3>用户信息详情</h3>
    <AreaTitleWarp :title="'用户基本信息'"></AreaTitleWarp>
    <AreaWarp :padding="false">
      <userBasic :userId="userId"></userBasic>
    </AreaWarp>

    <AreaWarp :padding="false" class="userInfo-tab">
      <el-tabs class="userInfo-el-tab" v-model="activeTab" type="card">
        <el-tab-pane label="复审页" name="first">
          <user_reviewCase :userId="userId" :approvalStatus="approvalStatus" :pageShow="pageShow" :creditId="creditId"></user_reviewCase>
        </el-tab-pane>
        <el-tab-pane label="网银信息" name="fourth">
          <user_bankInfo :userId="userId"></user_bankInfo>
        </el-tab-pane>
        <el-tab-pane label="运营商报告" name="five">
          <user_operatorInfo :userId="userId"></user_operatorInfo>
        </el-tab-pane>
      </el-tabs>
    </AreaWarp>
  </div>
</template>
<script>
  //基本信息
  import userBasic from "./userBasic.vue";

  //复审页面
  import user_reviewCase from "./user_reviewCase.vue";


  //网银信息
  import user_bankInfo from "./user_bankInfo.vue"

  //运营商报告
  import user_operatorInfo from "./user_operatorInfo.vue"

  export default({
    props: ["queryMsg"],
    components: {
      userBasic,
      user_reviewCase,
      user_bankInfo,
      user_operatorInfo
    },
    data(){
      return{
        activeTab: 'first',
        applyId: '',
        pageShow: '',
        approvalStatus: '',
        userId: '',
        creditId: '',
      }
    },
    created(){
      let that = this;
      that.pageShow = that.queryMsg.pageShow;
      that.approvalStatus = that.queryMsg.approvalStatus;
      that.userId = that.queryMsg.userId;
      that.creditId = that.queryMsg.creditId;
    }
  })
</script>
<style lang="less">
  .userInfo{
    .userInfo-tab{
      height:auto;
      background: #fff;
      .userInfo-el-tab{
        background:#fff;
        .el-tabs__header{
          position: relative !important;
          top: 0;
          width:100%;
          background: #fff;
          border-top-left-radius: 4px;
          border-top-right-radius: 4px;
        }
        .el-tabs__content{
          position: relative;
          top: 0;
          bottom: 0;
          overflow: auto;
          width:100%;
          background: #f6f6f6;
        }
      }
    }
  }
</style>
